<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    //保持keyword
    String adminId = request.getParameter("adminId") == null ? "" : request.getParameter("adminId");
    String keyword = request.getParameter("keyword") == null ? "" : request.getParameter("keyword");
    String pageNum = request.getParameter("pageNum") == null ? "" : request.getParameter("pageNum");
    String pageSize = request.getParameter("pageSize") == null ? "" : request.getParameter("pageSize");
%>
<!DOCTYPE html>
<html lang="zh-CN">
<%@include file="/WEB-INF/include-head.jsp" %>
<body>
<%@ include file="/WEB-INF/include-nav.jsp" %>
<div class="container-fluid">
    <div class="row">
        <%@ include file="/WEB-INF/include-sidebar.jsp" %>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <ol class="breadcrumb">
                <li><a href="#">首页</a></li>
                <li><a href="/admin/authority/user/list">数据列表</a></li>
                <li class="active">分配角色</li>
            </ol>
            <div class="panel panel-default">
                <div class="panel-body">
                    <form role="form" class="form-inline" action="/admin/authority/user/role/assign" method="post">
                        <input type="hidden" id="adminId" name="adminId" value="<%=adminId%>">
                        <input type="hidden" id="keyword" name="keyword" value="<%=keyword%>">
                        <input type="hidden" id="pageNum" name="pageNum" value="<%=pageNum%>">
                        <input type="hidden" id="pageSize" name="pageSize" value="<%=pageSize%>">
                        <div class="form-group">
                            <label for="unAssignRoleList">未分配角色列表</label><br>
                            <select class="form-control" id="unAssignRoleList" name="unAssignRoleList" multiple="" size="10" style="width:100px;overflow-y:auto;">
                                <c:forEach items="${requestScope.unAssignRoleList}" var="role">
                                    <option value="${role.id}">${role.name}</option>
                                </c:forEach>
                            </select>
                        </div>
                        <div class="form-group">
                            <ul>
                                <li class="btn btn-default glyphicon glyphicon-chevron-right" id="toRightBtn"></li>
                                <br/>
                                <li class="btn btn-default glyphicon glyphicon-chevron-left" id="toLeftBtn"style="margin-top:20px;"></li>
                            </ul>
                        </div>
                        <div class="form-group" style="margin-left:40px;">
                            <label for="assignRoleList">已分配角色列表</label><br>
                            <select class="form-control" id="assignRoleList" name="assignRoleList" multiple="" size="10" style="width:100px;overflow-y:auto;">
                                <c:forEach items="${requestScope.assignRoleList}" var="role">
                                    <option value="${role.id}">${role.name}</option>
                                </c:forEach>
                            </select>
                        </div>
                        <div class="form-group">
                            <button type="submit" id="assignBtn" class="btn btn-success">提交</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="static/js/curl.js"></script>
<script>
    //添加角色
    $('#toRightBtn').on('click', function () {
        let assignRoles = $('form select:eq(0)>option:selected');
        assignRoles.appendTo($("select:eq(1)"));
    });

    //取消角色
    $('#toLeftBtn').on('click', function () {
        let unAssignRoles = $('form select:eq(1)>option:selected');
        unAssignRoles.appendTo($("select:eq(0)"));
    })


    $('#assignBtn').on('click', function () {
        $('form select:eq(1)>option').prop('selected', 'selected');
        let roleList = $('form select:eq(1)').val();
    });
</script>
</html>
